<template>
  <view >
    <view class="product_box" :class="{'product_select':isSelect==item.ProductKey}"  v-for="item in listData" :key="item.Productkey" @click="select(item)">
      {{item.NickName}}
    </view>
  </view>

</template>

<script>
  export default{
    data(){
      return {
        listData:[],
        isSelect:''
      }
    },
    props:{
      pclick:{
        type:Object,
         default: () => {},
      }
    },
    created() {
      this.getData();
    },
    onLoad() {

    },
    methods:{
     /*获取数据*/
        getData() {
          let self = this;
          self._get('iot.product/index', {

          }, function(res) {

            self.listData=res.data.list;
            if(self.listData.length>0)
            {
               self.isSelect=self.listData[0].ProductKey;
              self.$emit('pclick',self.listData[0])
             }

          });
        },
        select(item){

          this.isSelect=item.ProductKey;
          this.$emit('pclick',item);
        }
    }
  }
</script>

<style>
  .product_box{
    height: 70px;
    background-color: #f8f8f8;
    margin: 5px;
    line-height: 70px;
    color: #000000;
    overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
  }
  .product_select{
    background-color: #4bced7;
    color: #FFFFFF;
  }
</style>
